<script setup>
import { ref, reactive, watch } from "vue";
import { getdeptByparentid } from "@/api/park";

const props = defineProps({
  modelName: {
    type: String,
    default: ''
  }
})
const modelValue = ref([])
const columnsData = ref([])
const emit = defineEmits(['update:modelName','pathChange'])
const localEventCallBks = ref(props.modelName);
const visible = ref(false)
const change = (data) => {
  // console.log('change',data)
  modelValue.value = data
}
const pathChange = (data) => {
  // console.log('pathChange',data)】
  emit('pathChange', data)
}
const handlePopup = () => {
  // console.log('handlePopup')
  getParkDept()
  visible.value = true
}

/* 获取所属园区下拉 */
const getParkDept = async() => {
  await getdeptByparentid({}).then(res => {
    columnsData.value = res.data
  })
}
 
</script>

<template>
  <nut-cell title="所属园区" :desc="modelName || '请选择所属园区'" @click="handlePopup"> </nut-cell>
    <nut-cascader
      v-model:visible="visible"
      v-model="modelValue"
      title="选择所属园区"
      text-key="label"
      value-key="id"
      children-key="children"
      :options="columnsData"
      @change="change"
      @path-change="pathChange"
    ></nut-cascader>
</template>

<style scoped lang="scss">

</style>


